<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>生产订单-详情</title>
    <!-- 引入 Element UI 的样式 -->
    <!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" /> -->
    <link rel="stylesheet" href="../../assets/css/element-ui.css" />
    <link rel="stylesheet" href="../../assets/css/styles.css" />
    <script src="../../assets/js/cdn.js"></script>
    <link rel="stylesheet" href="../../assets/fontawesome-free-6.7.2-web/css/all.min.css" />

  </head>
  <body>
    <div id="app">
      <lx-header slot="header" v-on:toggle="isToggle = !isToggle"></lx-header>
      <div class="app-containers main-content">
        <div class="container main-content">
          <div class="content" style="width: 100%">

            <h1 class="module-title">基本信息</h1>
            <div class="center-grid mb-20">
              <el-descriptions :column="4">
                <el-descriptions-item v-for="item in baseInfoHeader" :key="item.fieldApi" :label="item.label">
                  <div v-if="item.fieldApi==='order_status'">{{ getOptionsStr('so_status',formInfo[item.fieldApi]) }}</div>
                  <div v-else-if="item.fieldApi==='eoStatus'">{{ getOptionsStr('so_progress',formInfo[item.fieldApi]) }}</div>
                  <div v-else>{{ formInfo[item.fieldApi] ? formInfo[item.fieldApi]:'-' }}</div>
                </el-descriptions-item>
              </el-descriptions>
            </div>

            <div>
              <h1 class="module-title">工序列表</h1>
              <div class="center-grid mb-20">
                <el-table v-loading="tableLoading" :data="tableData" border :height="tableHeight">
                  <el-table-column v-for="(item, index) in tableColumnData" :key="index" :label="item.fieldName" min-width="150" :width="item.width">
                    <template slot-scope="scope">
                      <template> {{ scope.row[item.fieldApi] }} </template>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" :resizable="false" :show-overflow-tooltip="false" min-width="150" fixed="right">
                    <template slot-scope="item">
                      <el-button size="mini" type="text"  @click="openPuDia(item.row, false)">详情</el-button>
                      <el-button size="mini" type="text"  @click="openPuDia(item.row, true)">修改</el-button>
                      <el-button size="mini" type="text"  @click="delMoPu(item.row)">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>

              </div>
            </div>
          </div>
        </div>
      </div>


      <el-dialog title="新增部件" :visible.sync="openComponentDia" :fullscreen="true" width="800px" append-to-body>
        <el-table v-loading="componentTableLoading" :data="chooseComponentTable" @selection-change="selectionChange">
          <el-table-column type="selection" width="55" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in chooseComponentColumnData" :key="index" :label="item.fieldName" min-width="150" :width="item.width">
            <template slot-scope="scope">
              <template v-if="item.fieldApi==='componentUnit'">{{ getOptionsStr('base_component_unit',scope.row[item.fieldApi]) }}</template>
              <template v-else> {{ scope.row[item.fieldApi] }} </template>
            </template>
          </el-table-column>
        </el-table>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addData(0)">确 定</el-button>
          <el-button @click="cancleAdd">取 消</el-button>
        </div>
      </el-dialog>

      <el-dialog title="新增工具/工装" :visible.sync="openToolDia" :fullscreen="true" width="800px" append-to-body>
        <el-table v-loading="toolTableLoading" :data="chooseToolTable" @selection-change="selectionChange">
          <el-table-column type="selection" width="55" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in chooseToolColumnData" :key="index" :label="item.fieldName" min-width="150" :width="item.width">
            <template slot-scope="scope">
              <template v-if="item.fieldApi==='type'">{{ getOptionsStr('base_tools_type',scope.row[item.fieldApi]) }}</template>
              <template v-else> {{ scope.row[item.fieldApi] }} </template>
            </template>
          </el-table-column>
        </el-table>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addData(1)">确 定</el-button>
          <el-button @click="cancleAdd">取 消</el-button>
        </div>
      </el-dialog>

      <el-dialog title="新增辅料" :visible.sync="openAccessoriesDia" :fullscreen="true" width="800px" append-to-body>
        <el-table v-loading="AccessoriesTableLoading" :data="chooseAccessoriesTable" @selection-change="selectionChange">
          <el-table-column type="selection" width="55" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in chooseAccessoriesColumnData" :key="index" :label="item.fieldName" min-width="150" :width="item.width">
            <template slot-scope="scope">
              <template v-if="item.fieldApi==='type'">{{ getOptionsStr('base_accessories_type',scope.row[item.fieldApi]) }}</template>
              <template v-else> {{ scope.row[item.fieldApi] }} </template>
            </template>
          </el-table-column>
        </el-table>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addData(2)">确 定</el-button>
          <el-button @click="cancleAdd">取 消</el-button>
        </div>
      </el-dialog>

      <el-dialog :title="openPuTitle" :visible.sync="openPuDiaFlag" :fullscreen="true" width="800px" append-to-body>
          <div class="content" style="width: 100%">
            <h1 class="module-title">基本信息</h1>
            <div class="center-grid mb-20">
              <el-descriptions :column="2">
                <el-descriptions-item v-for="item in tableColumnData" :key="item.fieldApi" :label="item.fieldName" :span="['pu', 'technologyRequire', 'precautions'].includes(item.fieldApi) ? 2 : 1">
                  <template v-if="isEditPuFlag && (item.fieldApi === 'technologyRequire' || item.fieldApi === 'precautions')">
                    <el-input v-model="currentPuData[item.fieldApi]" type="textarea"/>
                  </template>
                  <template v-else-if="isEditPuFlag && (item.fieldApi === 'expectedStartTime' || item.fieldApi === 'expectedEndTime')">
                    <el-date-picker v-model="currentPuData[item.fieldApi]" type="datetime"></el-date-picker>
                  </template>
                  <template v-else> {{ currentPuData[item.fieldApi] ? currentPuData[item.fieldApi] : '-' }} </template>
                </el-descriptions-item>
              </el-descriptions>
            </div>
            <h1 class="module-title no-border no-margin">输入</h1>
            <div class="center-grid mb-10">
              <el-row class="mb8" >
                <el-col :span="1" :push="0">
                  <el-button v-if="isEditPuFlag" type="primary" plain size="mini" @click="addDia(currentPuData, 0, '1')">新增部件</el-button>
                  <el-button v-else type="text">部件</el-button>
                </el-col>
              </el-row>
              <el-table class="mt-10" v-loading="componentTableLoading" :data="currentPuData.puInputComponentList" stripe style="width: 100%">
                <el-table-column v-for="(item, index) in componentColumnData" :key="index" :label="item.fieldName" min-width="150">
                  <template slot-scope="scope">
                    <template v-if="item.fieldApi==='componentUnit'">{{ getOptionsStr('base_component_unit',scope.row[item.fieldApi]) }}</template>
                    <template v-else-if="item.fieldApi==='componentAttribute'">{{ getOptionsStr('component_attribute',scope.row[item.fieldApi]) }}</template>
                    <template v-else-if="isEditPuFlag && scope.row.componentCode && ['batchNo', 'qrCode'].includes(item.fieldApi)">
                      <el-input v-model="scope.row[item.fieldApi]" size="mini" />
                    </template>
                    <template v-else> {{ scope.row[item.fieldApi] }} </template>
                  </template>
                </el-table-column>
                <el-table-column v-if="isEditPuFlag" label="操作" :resizable="false" :show-overflow-tooltip="false" min-width="150" fixed="right">
                  <template slot-scope="item">
                    <el-button v-if="item.row.componentCode" size="mini" type="text"  @click="delData(item.row, 0)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>

            <div class="center-grid mb-10">
              <el-row class="mb8" >
                <el-col :span="1" :push="0">
                  <el-button v-if="isEditPuFlag" type="primary" plain size="mini" @click="addDia(currentPuData, 1)">新增工具/工装</el-button>
                  <el-button v-else type="text">工具/工装</el-button>
                </el-col>
              </el-row>
              <el-table class="mt-10" v-loading="toolTableLoading" :data="currentPuData.puToolsList" stripe style="width: 100%">
                <el-table-column v-for="(item, index) in toolColumnData" :key="index" :label="item.fieldName" min-width="150">
                  <template slot-scope="scope">
                    <template v-if="item.fieldApi==='type'">{{ getOptionsStr('base_tools_type',scope.row[item.fieldApi]) }}</template>
                    <template v-else-if="isEditPuFlag && scope.row.toolCode && item.fieldApi==='toolNum'">
                      <el-input v-model="scope.row[item.fieldApi]" size="mini"/>
                    </template>
                    <template v-else> {{ scope.row[item.fieldApi] }} </template>
                  </template>
                </el-table-column>
                <el-table-column v-if="isEditPuFlag" label="操作" :resizable="false" :show-overflow-tooltip="false" min-width="150" fixed="right">
                  <template slot-scope="item">
                    <el-button v-if="item.row.toolCode" size="mini" type="text"  @click="delData(item.row, 1)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>

            <div class="center-grid mb-10">
              <el-row class="mb8" >
                <el-col :span="1" :push="0">
                  <el-button v-if="isEditPuFlag" type="primary" plain size="mini" @click="addDia(currentPuData, 2)">新增辅料</el-button>
                  <el-button v-else type="text">辅料</el-button>
                </el-col>
              </el-row>
              <el-table class="mt-10" v-loading="AccessoriesTableLoading" :data="currentPuData.puAccessoriesList" stripe style="width: 100%">
                <el-table-column v-for="(item, index) in accessoriesColumnData" :key="index" :label="item.fieldName" min-width="150">
                  <template slot-scope="scope">
                    <template v-if="item.fieldApi==='accessoriesType'">{{ getOptionsStr('base_accessories_type',scope.row[item.fieldApi]) }}</template>
                    <template v-else-if="isEditPuFlag && scope.row.accessoriesCode && item.fieldApi==='accessoriesNum'">
                      <el-input v-model="scope.row[item.fieldApi]" size="mini"/>
                    </template>
                    <template v-else> {{ scope.row[item.fieldApi] }} </template>
                  </template>
                </el-table-column>
                <el-table-column v-if="isEditPuFlag" label="操作" :resizable="false" :show-overflow-tooltip="false" min-width="150" fixed="right">
                  <template slot-scope="item">
                    <el-button v-if="item.row.accessoriesCode" size="mini" type="text"  @click="delData(item.row, 2)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>

            <h1 class="module-title no-border no-margin">输出</h1>
            <div class="center-grid mb-10">
              <el-row class="mb8" >
                <el-col :span="1" :push="0">
                  <el-button v-if="isEditPuFlag" type="primary" plain size="mini" @click="addDia(currentPuData, 3, '2')">新增部件</el-button>
                  <el-button v-else type="text">部件</el-button>
                </el-col>
              </el-row>
              <el-table class="mt-10" v-loading="componentTableLoading" :data="currentPuData.puOutputComponentList" stripe style="width: 100%">
                <el-table-column v-for="(item, index) in componentColumnData" :key="index" :label="item.fieldName" min-width="150">
                  <template slot-scope="scope">
                    <template v-if="item.fieldApi==='componentUnit'">{{ getOptionsStr('base_component_unit',scope.row[item.fieldApi]) }}</template>
                    <template v-else-if="item.fieldApi==='componentAttribute'">{{ getOptionsStr('component_attribute',scope.row[item.fieldApi]) }}</template>
                    <template v-else-if="isEditPuFlag && scope.row.componentCode && ['batchNo', 'qrCode'].includes(item.fieldApi)">
                      <el-input v-model="scope.row[item.fieldApi]" size="mini"/>
                    </template>
                    <template v-else> {{ scope.row[item.fieldApi] }} </template>
                  </template>
                </el-table-column>
                <el-table-column v-if="isEditPuFlag" label="操作" :resizable="false" :show-overflow-tooltip="false" min-width="150" fixed="right">
                  <template slot-scope="item">
                    <el-button v-if="item.row.componentCode" size="mini" type="text"  @click="delData(item.row, 3)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>

            <h1 class="module-title no-border no-margin">人员</h1>
            <div class="center-grid mb-20">
              <el-table v-loading="componentTableLoading" :data="currentPuData.puUserList" stripe style="width: 100%">
                <el-table-column v-for="(item, index) in employeeColumnData" :key="index" :label="item.fieldName" min-width="150">
                  <template slot-scope="scope">
                    <template> {{ scope.row[item.fieldApi] }} </template>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        <div v-if="isEditPuFlag" slot="footer" class="dialog-footer">
          <el-button type="primary" @click="saveMoPuData">确 定</el-button>
          <el-button @click="cancelPuDia">取 消</el-button>
        </div>
      </el-dialog>


    </div>
    <script src="../../assets/js/constant.js"></script>
    <script src="../../assets/js/utils.js"></script>
    <script src="../../assets/js/auth.js"></script>
    <script src="../../assets/js/axios.min.js"></script>
    <!-- 引入 Vue.js -->
    <script src="../../assets/js/vue.js"></script>
    <!-- 引入 Element UI 的 JS 文件 -->
    <script src="../../assets/js/element-ui.js"></script>

    <script type="module">
      import LxHeader from '../../pages/components/LxHeader/index.js'
      Vue.component('lx-header', LxHeader)

      checkAuthentication(2)
      new Vue({
        el: '#app',
        components: {},
        data() {
         return {
           isToggle: false,

           currentUser: JSON.parse(localStorage.getItem('currentUser')) || {},
            userMenuList: JSON.parse(localStorage.getItem('userMenuList')) || [],
            // username: '张三',
            // avatorURL: '',
            dicts: ['so_status', 'so_progress', 'base_component_unit','base_tools_type','base_accessories_type','component_attribute'],
            optionsObj: {},
            tableLoading: false,
            tableData: [],
           tableHeight:200,
            baseInfoHeader: [
              { label: '生产订单编号', fieldApi: 'moCode' },
              { label: '关联销售订单编号', fieldApi: 'soCode' },
              { label: '生产开始时间', fieldApi: 'startTime' },
              { label: '生产结束时间', fieldApi: 'endTime' },
              { label: '执行进度', fieldApi: 'eoStatus' },
              { label: '备注', fieldApi: 'remark' },
              { label: '创建人', fieldApi: 'createBy' },
              { label: '创建时间', fieldApi: 'createTime' },
              { label: '车平台', fieldApi: 'carPlatformName' },
              { label: '车型号', fieldApi: 'carModelName' }
            ],
            tableColumnData: [
              {
                fieldName: 'PU工序',
                fieldApi: 'pu',
                width: '200'
              },
              {
                fieldName: '技术要求',
                fieldApi: 'technologyRequire'
              },
              {
                fieldName: '注意事项',
                fieldApi: 'precautions'
              },
              {
                fieldName: '预计开始时间',
                fieldApi: 'expectedStartTime'
              },
              {
                fieldName: '预计结束时间',
                fieldApi: 'expectedEndTime'
              },
              {
                fieldName: '实际开始时间',
                fieldApi: 'startTime'
              },
              {
                fieldName: '实际结束时间',
                fieldApi: 'endTime'
              }
            ],
            formInfo: {},
            detailDialog: false, // 详情
            rowDetail: {},
            optionDatas: [],
            moCode: '',
            puCode: '',
            root_host: root_host,
            request_host: request_host,
            openComponentDia: false,
            openToolDia: false,
            addComponentFlag: '',
            componentColumnData: [
              {
                fieldName: '部件编号',
                fieldApi: 'componentCode',
                width:'220'
              },
              {
                fieldName: '部件名称',
                fieldApi: 'componentName'
              },
              {
                fieldName: '批次',
                fieldApi: 'batchNo'
              },
              {
                fieldName: '供应商',
                fieldApi: 'supplier'
              },
              {
                fieldName: '唯一码',
                fieldApi: 'qrCode'
              },
              {
                fieldName: '部件属性',
                fieldApi: 'componentAttribute'
              },
              {
                fieldName: '单位',
                fieldApi: 'componentUnit'
              },
              {
                fieldName: '数量',
                fieldApi: 'componentNum'
              }
            ],
            componentTableDataInput: [],
            componentTableDataOutput: [],
            componentTableLoading: false,
            toolColumnData: [
              {
                fieldName: '工具/工装编号',
                fieldApi: 'toolCode',
                width:'220'
              },
              {
                fieldName: '工具/工装类型',
                fieldApi: 'type'
              },
              {
                fieldName: '工具/工装名称',
                fieldApi: 'toolName'
              },
              {
                fieldName: '数量',
                fieldApi: 'toolNum'
              }
            ],
            toolTableData: [],
            toolTableLoading: false,
            accessoriesColumnData: [
              {
                fieldName: '辅料编号',
                fieldApi: 'accessoriesCode',
                width:'220'
              },
              {
                fieldName: '辅料类型',
                fieldApi: 'accessoriesType'
              },
              {
                fieldName: '辅料名称',
                fieldApi: 'accessoriesName'
              },
              {
                fieldName: '数量',
                fieldApi: 'accessoriesNum'
              }
            ],
            AccessoriesTableData: [],
            AccessoriesTableLoading: false,
            chooseComponentTable: [],
            chooseComponentTotal: 0,
            queryParams: {
              pageNo: 1,
              pageSize: 10,
              puCode: '',
              puName: ''
            },
            chooseComponentColumnData: [
              {
                fieldName: '部件编号',
                fieldApi: 'componentCode'
              },
              {
                fieldName: '部件名称',
                fieldApi: 'componentName'
              },
              {
                fieldName: '批次',
                fieldApi: 'batchNo'
              },
              {
                fieldName: '供应商',
                fieldApi: 'supplier'
              },
              {
                fieldName: '唯一码',
                fieldApi: 'qrCode'
              },
              {
                fieldName: '单位',
                fieldApi: 'componentUnit'
              },
              {
                fieldName: '数量',
                fieldApi: 'componentCount'
              }
            ],
            chooseToolColumnData: [
              {
                fieldName: '工具/工装编号',
                fieldApi: 'toolCode'
              },
              {
                fieldName: '工具/工装类型',
                fieldApi: 'type'
              },
              {
                fieldName: '工具/工装名称',
                fieldApi: 'toolName'
              },
              {
                fieldName: '备注',
                fieldApi: 'remark'
              }
            ],
            chooseToolTable: [],
            chooseToolTotal: 0,
            openAccessoriesDia: false,
            chooseAccessoriesTable: [],
            chooseAccessoriesTotal: 0,
            chooseAccessoriesColumnData: [
              {
                fieldName: '辅料编号',
                fieldApi: 'accessoriesCode'
              },
              {
                fieldName: '辅料类型',
                fieldApi: 'type'
              },
              {
                fieldName: '辅料名称',
                fieldApi: 'accessoriesName'
              },
              {
                fieldName: '备注',
                fieldApi: 'remark'
              }
            ],
            employeeColumnData: [
              {
                fieldName: '人员编号',
                fieldApi: 'employeeCode'
              },
              {
                fieldName: '人员名称',
                fieldApi: 'employeeName'
              },
              {
                fieldName: '工位',
                fieldApi: 'stationCode'
              },
              // {
              //   fieldName: '预计开始时间',
              //   fieldApi: 'expectedStartTime'
              // },
              // {
              //   fieldName: '预计结束时间',
              //   fieldApi: 'expectedEndTime'
              // },
              {
                fieldName: '实际开始时间',
                fieldApi: 'startTime'
              },
              {
                fieldName: '实际结束时间',
                fieldApi: 'endTime'
              }
            ],
            selectionData: [],
            openPuTitle: 'PU工序详情',
            openPuDiaFlag: false,
            currentPuData: {},
            isEditPuFlag: false
          }
        },
        created() {
          this.init()
        },
        methods: {
          exit,
          init() {
            this.moCode = getUrlParameter('moCode')
            this.getOptions()
            this.getOrderInfo()
            this.getPuDataList()
            this.tableHeight = window.innerHeight - 350;
          },
          getOptions() {
            this.dicts.forEach((item) => {
              axios.get(`${this.request_host}/system/dict/data/type/${item}`).then((response) => {
                this.$set(this.optionsObj, item, {})
                if (response.status == 200) {
                  response.data.data.map((item1) => {
                    this.optionsObj[item][item1.dictValue] = item1.dictLabel
                  })
                }
              })
            })
          },
          getOptionsStr(opt, value) {
            if (this.optionsObj[opt] && value) {
              return this.optionsObj[opt][value]
            }
            return ''
          },
          getOrderInfo() {
            try {
              axios.get(`${this.request_host}/order/manufactureOrder/${this.moCode}`).then((response) => {
                if (response.status == 200) {
                  this.formInfo = response.data.data
                }
              })
            } catch (error) {
              console.error('请求失败:', error)
            }
          },
          getPuDataList() {
            try {
              this.tableLoading = !this.tableLoading
              axios.get(`${this.request_host}/manufactureOrder/pu/data/list?moCode=${this.moCode}`).then((response) => {
                if (response.status == 200) {
                  this.tableData = response.data.rows
                }
                  this.tableLoading = !this.tableLoading
              })
            } catch (error) {
              console.error('请求失败:', error)
            }
          },
          addDia(row, type, val) {
            this.puCode = row.puCode
            switch (type) {
              case 0:
              case 3:
                  this.openComponentDia = true
                  axios.get(`${this.request_host}/system/component/list`,{ params: this.queryParams }).then((response) => {
                      if (response.status == 200) {
                          this.chooseComponentTable = response.data.rows
                          this.chooseComponentTotal = response.data.total
                      }
                  });
                  this.addComponentFlag = val
                  break;
              case 1:
                  this.openToolDia = true
                  axios.get(`${this.request_host}/system/tools/list`,{ params: this.queryParams }).then((response) => {
                      if (response.status == 200) {
                          this.chooseToolTable = response.data.rows
                          this.chooseToolTotal = response.data.total
                      }
                  })
                  break;
              case 2:
                  this.openAccessoriesDia = true
                  axios.get(`${this.request_host}/system/accessories/list`,{ params: this.queryParams }).then((response) => {
                      if (response.status == 200) {
                          this.chooseAccessoriesTable = response.data.rows
                          this.chooseAccessoriesTotal = response.data.total
                      }
                  })
                  break;
            }
          },
          // 多选框选中数据
          selectionChange(selection) {
              this.selectionData = selection
          },
          selectionComponentChange(selection) {
            this.ids = selection.map(item => item.componentCode)
          },
          cancleAdd(){
            this.ids = []
            this.selectionData = []
            this.openComponentDia = false
            this.openToolDia = false
            this.openAccessoriesDia = false
          },
          // 多选框选中数据
          selectionToolChange(selection) {
            this.ids = selection.map(item => item.toolCode)
          },
          selectionAccessoriesChange(selection){
            this.ids = selection.map(item => item.accessoriesCode)
          },
          // 处理工具数量变更
          handleChange(row, type) {
              let url = ''
              switch (type) {
                  case 0:
                  case 3:
                      // 部件
                      url = `${this.request_host}/manufactureOrder/pu/component`
                      break;
                  case 1:
                      // 工具
                      url = `${this.request_host}/manufactureOrder/pu/tools`
                      break;
                  case 2:
                      // 辅料
                      url = `${this.request_host}/manufactureOrder/pu/accessories`
                      break;
                  case 4:
                      // pu
                      url = `${this.request_host}/manufactureOrder/pu/data`
                      break;
              }
              axios.put(url, row).then(response => {
                  if (response.status == 200) {
                      this.$message.success('保存成功');
                  }
              }).catch(error => {
                  console.error('保存失败:', error);
                  this.$message.error('保存失败');
              });
          },
          // 添加pu关联数据
          addData(type) {

              switch (type) {
                  case 0:
                      this.currentPuData.puInputComponentList.push(...this.selectionData)
                      break;
                  case 1:
                      this.currentPuData.puToolsList.push(...this.selectionData)
                      break;
                  case 2:
                      this.currentPuData.puAccessoriesList.push(...this.selectionData)
                      break;
                  case 3:
                      this.currentPuData.puOutputComponentList.push(...this.selectionData)
                      break;
              }
              const addParams = {
                  type: type,
                  moCode: this.moCode,
                  puCode: this.puCode,
                  ids: this.ids,
                  componentAttribute: this.addComponentFlag
              }
              this.cancleAdd()
              // axios.post(`${this.request_host}/manufactureOrder/pu/data/addPuRelationData`, addParams).then((response) => {
              //     if (response.status == 200) {
              //         this.getPuDataList()
              //         this.cancleAdd()
              //     } else {
              //         this.$message.error(response.data.msg);
              //     }
              // })
          },
          // 删除pu关联数据
          delData(row, type) {
              const delParams = {
                  type: type,
                  moCode: this.moCode,
                  puCode: row.puCode,
                  delId: ''
              }
              // 数据删除
              switch (type) {
                  case 0:
                      // 输入部件
                      delParams.delId = row.componentCode
                      delParams.componentAttribute = '1'
                      break;
                  case 1:
                      // 工具工装
                      delParams.delId = row.toolCode
                      break;
                  case 2:
                      // 辅料
                      delParams.delId = row.accessoriesCode
                      break;
                  case 3:
                      // 输出部件
                      delParams.delId = row.componentCode
                      delParams.componentAttribute = '2'
                      break;
                  case 4:
                      // 人员
                      delParams.delId = row.userId
                      break;
              }
            axios.post(`${this.request_host}/manufactureOrder/pu/data/delPuRelationData`,delParams).then((response) => {
              if (response.status == 200) {
                  this.getPuDataList()
              }
            })
          },
          openPuDia(row, type) {
            this.isEditPuFlag = type
            this.openPuDiaFlag = true
            this.openPuTitle = type ? 'PU工序修改' : 'PU工序详情'
            this.currentPuData = row
          },
          saveMoPuData() {
            axios.post(`${this.request_host}/manufactureOrder/pu/data/saveMoPuData`, this.currentPuData).then((response) => {
                if (response.status == 200) {
                    cancelPuDia()
                }
            })
          },
          cancelPuDia(){
              this.openPuDiaFlag = false
              this.currentPuData = {}
          },
          delMoPu(row){
            console.log(row)
            const delParams = {
                  moCode: row.moCode,
                  puCode: row.puCode
              }
              this.$confirm('是否确认删除编号为"' + row.puCode + '"的数据项？', "警告", {
                  confirmButtonText: "确定",
                  cancelButtonText: "取消",
                  type: "warning"
              }).then(() => {
                  // 这里替换为实际的API调用
                  axios.post(`${this.request_host}/manufactureOrder/pu/data/delMoPuData`, delParams).then((response) => {
                      if (response.status == 200) {
                        this.$message.success("删除成功")
                        this.getPuDataList()
                      }
                  })
              })
          }
        }
      })
    </script>
    <style>
      .el-table th.el-table__cell {
        background-color: #f2f2f2; /* 例如，设置为浅灰色 */
      }
      /*.el-table {*/
      /*    overflow: visible;*/
      /*}*/
      /*.el-table__header-wrapper {*/
      /*    position: sticky;*/
      /*    top: 0;*/
      /*    z-index: 10;*/
      /*}*/
    </style>
  </body>
</html>
